// elementUI 全局样式修改
// $--color-primary: #11D9C5 !default;
$--color-primary: #1a3452 !default;
$--color-success: #67c23a !default;
$--color-warning: #e6a23c !default;
$--color-danger: #f56c6c !default;
$--color-info: #909399 !default;
//Font Color
$--color-text-primary: #303133 !default;
$--color-text-regular: #606266 !default;
$--color-text-secondary: #909399 !default;
$--color-text-placeholder: #c0c4cc !default;
// Background Color
$--color-white: #ffffff !default;
$--color-black: #000000 !default;
$--background-color-base: #f5f7fa !default;
$--color-primary-light-3: mix($--color-white, $--color-primary, 30%) !default; /* 79bbff */


//自定义变量
//导出变量供js使用
:export {
  colorPrimary: $--color-primary;
  colorDanger: $--color-danger;
}

// 自定义全局样式
html {
  font-size: 80px;
}

body {
  font-size: 14px;
}

html,
body,
p {
  margin: 0;
  padding: 0;
}

//列表上方按钮样式
.listManager-btnGroup-wrap {
  overflow: hidden;
  margin-bottom: 18px;
  border-bottom: $--color-primary 1px solid;
}

.listManager-btnGroup {
  margin-bottom: 18px;
  float: right;
}

.listManager-btnGroup-left {
  float: left;
  display: flex;
  flex-direction: row;
  align-items: center;

  .el-date-editor {
    width: 214px !important;
  }

  .el-date-editor--daterange {
    width: 216px !important;
  }

  .el-date-editor--datetimerange {
    width: 340px !important;
  }
}

/*表格按钮样式*/
.table-icon-btn {
  font-size: 16px;
  margin-left: 5px;
  margin-right: 5px;
  cursor: pointer;
  vertical-align: middle !important;
}

.table-icon-btn:hover {
  font-size: 22px;
  margin: 0 2px;
}

.el-select {
  width: 100%;
}

.color-warning {
  color: $--color-warning;
}

.color-error {
  color: $--color-danger;
}

.color-primary {
  color: $--color-primary;
}

.color-success {
  color: $--color-success;
}

// form中 警示文字class 标注 红色
.callout-red {
  color: $--color-danger;
  font-size: 12px;
}

// 全局弹窗 头部颜色
::v-deep .el-dialog__header {
  background: $--color-primary;

  .el-dialog__title, i {
    color: #fff !important;
  }

  i:hover {
    color: #fff !important;
  }
}

.el-dialog__header {
  background: $--color-primary;

  .el-dialog__title, i {
    color: #fff !important;
  }

  i:hover {
    color: #fff !important;
  }
}

.table-header-weight {
  color: $--color-danger !important;
  font-size: 14px;
}

// 页面 中间部分文字样式 例如  共 100 笔  合计100元
.number-highlight {
  padding: 5px 0;
  font-size: 12px;

  span {
    margin: 0 5px;
    font-size: 14px;
    font-weight: bold;
  }
}

// 链接文字样式
.link-blue, .link-blue:hover {
  color: #4E9AF2;
}

//页面表格包装样式
.page-form-wrap {
  width: 700px;
  border: 1px solid #dcdfe6;
  border-radius: 3px;
  padding: 30px 0 10px 0;
  position: relative;

  .page-form-title {
    border-left: 5px solid $--color-success;
    font-size: 18px;
    padding: 0 10px;
    margin-left: 20px;
  }

  .el-form {
    padding: 0 20px;
    margin-bottom: 52px;
  }

  .save-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #dcdfe6;
    padding: 10px 0;
    position: absolute;
    bottom: 0;
    width: 100%;
  }
}

// 由于elementUI 的密码输入框会引起浏览器的自动填充  所以使用该样式
// 使用方式 <el-input  class="no-autofill-pwd"   v-model="form.password" placeholder="请输入登录密码"></el-input>
.no-autofill-pwd {

  ::v-deep .el-input__inner {

    -webkit-text-security: disc !important;

  }
}

.no-autofill-pwd {

  .el-input__inner {

    -webkit-text-security: disc !important;

  }
}
